<template>
    <div id="tixian" class="box1 bordert">
        <div class="ttitle">佣金提现</div>
        <div class="input">
                <div>输入充值金额</div>
                <div class="input2">
                    <span style="font-size: 40px;">￥</span>
                    <input class="input3 colorg" type="text" v-model="money">
                    <div>
                        <span class="colorg">可提现佣金</span>
                        <span class="ml10 colorg">￥{{ ktxyj }}</span>
                        <span class="ml10 colorb pointer" @click="qbtx">全部提现</span>
                    </div>
                </div>
        </div>
        <div class="input11">
                <div class="in">提现到</div>
                <div class="way in">
                    <img class="icon" src="../../assets/img/zfb.png" alt="">
                    <span class="wz">支付宝</span>
                </div>
        </div>
        <div class="affirm">
            <button class="btn" @click="showPopupTx">确认提现</button>
            <popupTx v-show="isPopupVisibleTx" @closeTx="closePopupTx" @closeTx1="closePopupTx1" :money='money'></popupTx>
            <popupCg v-show="isPopupVisibleCg" @closeCg="closePopupCg"></popupCg>
        </div>
        <div style="height:600px"></div>
    </div>
</template>
<script>
import popupTx from '../popup/popuptx'
import popupCg from '../popup/succeed'
export default {
    name: 'tixian',
    components: {
        popupTx,
        popupCg
  },
  data () {
    return {
        ktxyj:'',
        money:'',
        isPopupVisibleTx: false,
        isPopupVisibleCg: false
    }
  },
  created() {
      
  },
  mounted() {
      this.yongjin()
  },
  methods: {
      yongjin() {
          this.ktxyj = JSON.parse(window.localStorage.getItem('yonghuxinxi')).integral
      },
      qbtx() {
          this.money = this.ktxyj
      },
    // 提现弹框
    showPopupTx(){
      this.isPopupVisibleTx = true
    },
    closePopupTx(){
      this.isPopupVisibleTx = false
    },
    closePopupTx1(data){
      this.isPopupVisibleTx = false
      this.isPopupVisibleCg = data
      console.log(this.isPopupVisibleCg)
    },

    // 提现成功弹框
    showPopupCg(){
      this.isPopupVisibleCg = true
    },
    closePopupCg(){
      this.isPopupVisibleCg = false
    }
  }
  }
</script>
<style lang="less" scoped>
@import "../../assets/css/index.css";
    .box1 {
        background-color: #fff;
        .input {
            margin-top: 20px;
            height: 120px;
            width: 93.5%;
            padding: 1%;
            border: 1px solid #DEDEDE;
            margin: 0 auto;
            .input2 {
                margin-top: 20px;
                height: 50px;
                // font-size: 40px;
                .input3 {
                    width: 80%;
                    height: 60px;
                    // margin-left: 60px;
                    outline: none;
                    border: 0;
                    font-size: 40px;
                }
            }
        }
        .input11 {
            position: relative;
            // margin-top: 50px;
            height: 20px;
            width: 93.5%;
            padding: 1%;
            border: 1px solid #DEDEDE;
            margin: 20px auto;
            z-index:-1;
            .way {
                width: 90px;
                position: absolute;
                right: 5px;
                height: 20px;
                .wz {
                    position: absolute;
                }
            }
        }
        .affirm {
            position: relative;
            // margin-top: 50px;
            height: 20px;
            width: 93.5%;
            padding: 1%;
            margin: 20px auto;
            .btn {
                width: 90px;
                position: absolute;
                background-color: #F9F7F5;
                right: 5px;
                height: 35px;
                color: #FF8F20;
                border: 1px solid #FF8F20;
                // z-index: 1;
            }
        }
    }
    .in {
        display: inline;
    }
    .icon {
        width: 25px;
        height: 25px;
    }

</style>